<template>
    <div>
        <van-cell style="margin-top: 30px;height: 50px;text-align: center" is-link title="添加羊毛户" @click="onAdd" />
        <van-popup
                v-model:show="showAdd"
                closeable
                position="bottom"
                :style="{ height: '70%' }"
        >
            <van-form style="margin-top: 30%" @submit="onSubmit">
                <van-field
                        v-model="userName"
                        name="userName"
                        label="用户名"
                        placeholder="用户名"
                        :rules="[{ required: true, message: '请填写用户名' }]"
                />
                <div style="margin: 16px;">
                    <van-button round block type="primary" native-type="submit">提交</van-button>
                </div>
            </van-form>

        </van-popup>


        <div class="card"  v-for="(item, index) in list" :key="index">
            <van-contact-card
                    type="edit"
                    :name="item.userName"
                    tel="保密"
                    @click="onEdit"
            />
        </div>



    </div>
</template>

<script>

    import myInfo from '@/api/myInfo';
    import {Toast} from 'vant';
    export default {
        name: "index",
        data() {
            return {
                userName: '',

                list:[],
                showAdd:false,


            }
        },
        created() {
            this.getAllUser();

        },
        methods: {
            getAllUser(){
                myInfo.getAllUser().then(response => {
                    if (response.code === 200) {
                        this.list = response.data;
                    } else {
                        Toast(response.message + '');
                    }

                }).catch(error => {
                    console.log(error);
                });
            },
            onAdd() {
                this.showAdd = true;
            },

            onSubmit(values) {
                myInfo.add({"userName": this.userName}).then(response => {
                    if (response.code === 200) {
                        Toast('成功');
                    } else {
                        Toast(response.message + '');
                    }
                }).catch(error => {
                    console.log(error);
                });
                this.showAdd = false;
                this.getAllUser();
            },

            onEdit(values) {
                myInfo.edit({"userName": this.userName}).then(response => {
                    if (response.code === 200) {
                        Toast(response);
                    } else {
                        Toast(response.message + '');
                    }
                }).catch(error => {
                    console.log(error);
                });
            },





        },




    }
</script>

<style scoped>
    .card {
        margin-top: 50px;
    }

</style>
